<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"/>
    <meta name="referrer" content="no-referrer"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <meta name="renderer" content="webkit|ie-comp|ie-stand"/>
    <link rel="stylesheet" href="css/weui.css">
    <title>我的树莓派</title>
    <style>
        .weui-cell__hd img {
            width: 32px;
            margin-right: 5px;
            display: block
        }

        .weui-cell__bd > a {
            color: #555;
        }
    </style>
</head>
<body>

<div class="weui-cells">


    <div class="weui-cell">
        <div class="weui-cell__hd"><img
                src="images/user.png"
                alt="" style=""></div>
        <div class="weui-cell__bd">
            <a data-port="8080"><p>superviosr</p></a>
        </div>
        <div class="weui-cell__ft">控制台</div>
    </div>


    <div class="weui-cell">
        <div class="weui-cell__hd"><img
                src="images/distribute-left-edges.png"
                alt="" style=""></div>
        <div class="weui-cell__bd">
            <a data-port="8081"><p>smart-home</p></a>
        </div>
        <div class="weui-cell__ft">智能家庭</div>
    </div>

    <div class="weui-cell">
        <div class="weui-cell__hd"><img
                src="images/spool.png"
                alt="" style=""></div>
        <div class="weui-cell__bd">
            <a data-port="8082"><p>my-home</p></a>
        </div>
        <div class="weui-cell__ft">追剧</div>
    </div>

    <div class="weui-cell">
        <div class="weui-cell__hd"><img
                src="images/spool.png"
                alt="" style=""></div>
        <div class="weui-cell__bd">
            <a data-port="8200"><p>dlna</p></a>
        </div>
        <div class="weui-cell__ft">dlna</div>
    </div>

    <div class="weui-cell">
        <div class="weui-cell__hd"><img
                src="images/spool.png"
                alt="" style=""></div>
        <div class="weui-cell__bd">
            <a data-port="8083"><p>vue-webpack-music</p></a>
        </div>
        <div class="weui-cell__ft">悦动</div>
    </div>

</div>

</body>
<script src="js/jquery-3.1.1.min.js"></script>
<script>
    +function () {
        var hrefPrefix = location.protocol + "//" + location.hostname + ":";
        $("[data-port]").each(function () {
            var $self = $(this)
            var host = hrefPrefix + $self.data("port");
            var href = host + ($self.attr("href") || "")
            $self.attr("href", href)
            $self.attr("target", href)
        })
    }();
</script>
</html>